<template>
  <div>
    <ul>
      <template v-if="news == null">
        <li>加载中...</li>
      </template>
      <template v-else>
        <li @click="godetail(item.id)" v-for="item in news" :key="item.id">{{ item.title }}</li>
      </template>
    </ul>
    <hr>
    <router-link to="/login">登录</router-link>
  </div>
</template>

<script>
import { get } from '@/utils/http'
export default {
  data() {
    return {
      news: null
    }
  },
  async created() {
    let ret = await get('/mock/news.json')
    this.news = ret
  },
  methods: {
    godetail(id) {
      // this.$router.push(`/news/${id}?kw=abc`)
      // this.$router.push(`/xw/${id}?kw=abc`)
      // 命名路由跳转
      this.$router.push({
        name: 'xw',
        params: { id }
      })
    }
  }
}
</script>

<style lang="scss" scoped></style>
